tem<script>
import RunningTime from '@/common/runningTime'
import { mapState } from 'vuex'

export default {
  props: {
    IsShow: Boolean,
    type: {
      type: String,
      default: 'personNumSum',
    },
  },
  components: { RunningTime },
  // creater() {
  //   this.currentType = this.type
  // },
  data() {
    return {
      timeRadio: 'day',
      currentType: 'personNumSum',
      time: null,
      typeList: [
        {
          name: '运动人数',
          value: 'personNumSum',
        },
        {
          name: '运动人次',
          value: 'entNumSum',
        },
        {
          name: '饱和度',
          value: 'baoHeDu',
        },
        {
          name: '集流力',
          value: 'jiLiuLi',
        },
      ],
    }
  },
  methods: {
    change(time) {
      this.time = time
      this.$emit('typechange', {
        startTime: time ? time[0] : '',
        endTime: time ? time[1] : '',
        interval: time ? time.join('=') : '',
        radio: this.timeRadio,
      })
    },
  },
  watch: {
    currentType(type) {
      this.$emit('update:type', this.currentType)
      this.change(this.time)
    },
  },
}
</script>

<template lang="pug">
.timePick
  .group
    label 查询方式：
    el-radio-group(v-model="timeRadio")
      el-radio( label="day" ) 日
      //- el-radio( label="week" ) 周
      el-radio( label="month" ) 月
      //- el-radio( label="year" ) 年
  .group
    label 选择查询时间段：
    TimePick(@getTime="change" v-if="timeRadio=='day'")
    TimePicks(@getTime="change" v-else)
  el-select(v-model="currentType" v-if="IsShow")
    el-option(v-for="item in typeList"  :key="item.name" :label="item.name" :value="item.value") {{item.name}}
  //- el-radio-group()
  //-   el-radio-button(v-for="item in typeList"  :key="item.sportName" :label="item.id") {{item.sportName}}
</template>
<style lang="stylus" scoped>
.el-select
  margin 10px
.timePick
  display flex
  justify-content space-around
@media screen and (max-width: 650px)
  .timePick
    display block
  .el-select
    margin 0
</style>
